<!DOCTYPE html>
<html>
 <#include "include/header.html"/>
  <body id="champions">
    <div class="page">
      <div class="content">
        <img src="${ctx}/resource/images/banner.png" class="banner">
        <div class="wrap">
          <#if championUser??>
				 <div class="info">
                     <div class="coins">我的活力币：<span id="myEnergyCurrency">${championUser.energy_currency!}</span></div>
                 </div>
          <#else>
           		 <div class="info">
                     <div class="coins">我的活力币：<span id="myEnergyCurrency">0</span></div>
                 </div>
		  </#if>
		   <!-- 导航栏 -->
          <div class="nav-wrap" id="nav-wrap">
            <nav>
              <ul>
                <li><a href="${ctx}/home/homePage">返回首页</a></li>
                <li><a href="javascript:void(0);" onclick="forwardChampionship(1)">查看排行</a></li>
              </ul>
            </nav>
          </div>
          <img src="${ctx}/resource/images/champions/band.png" class="band">
          <div class="desc">
            <h3>为偶像加活力，抢1万朵免费鲜花</h3>
            <p>赢活力币，为idol加活力，1万朵鲜花免费抢，活力越高的idol获得的鲜花越多。</p>
            <p>每周一8:00开始统计，每周日24:00截止统计，数据每周清零。</p>
          </div>
          <div class="ranking">
            <ul id="championship">
            <#list championStartList as s > 
              <li>
                <div class="avatar" style="background-image: url('${server_uri!}${s.start_head_pic!}');"></div>
                <div class="user">
                  <span class="name">${s.start_name!}</span>
                 
                  <span class="energy" id="energy-${s_index!}">${s.energy_currency!}</span>
                </div>
                  <img src="${ctx}/resource/images/champions/energy_btn.png" class="energy-btn" name="${s.start_name!}" enery_index="energy-${s_index!}" start_id="${s.id!}" start_img="${server_uri!}${s.start_head_pic!}" onclick="energyClick(this)">
              </li>
             </#list>
             </ul>
          </div>
        </div>
        <!-- 加活力 -->
         <div class="dialog cheerup">
          <div class="d-body">
            <div class="user-wrapper">
              <div class="user">
                <div class="avatar" style="background-image: url( !-- 头像url --!);" id="avatar"></div>
                <span class="name" id="name">贾乃亮</span>
              </div>
            </div>
            <div class="op">
              <img src="${ctx}/resource/images/champions/jian.png" class="jian" >
              <div class="num"><input id="num" type="number" value="1" /></div>
              <img src="${ctx}/resource/images/champions/jia.png" class="jia" >
            </div>
            <div class="info">
              <div class="coins">我的活力币：<span id="energyCurrency">999</span></div>
            </div> 
          </div>
          <div class="d-footer">
            <img src="${ctx}/resource/images/index/dialog_btn_yes.png" class="btn btns yes" alt="" onclick="dialog('.qd-confirm');"> <!--确认按钮-->
            <img src="${ctx}/resource/images/index/dialog_btn_back.png" class="btn btns back" alt="" onclick="dialogClose()"> <!--返回按钮-->
          </div>
        </div>

        <!-- 查看失败 -->
        <div class="dialog fail">
          <div class="d-body" id="fail-energy">
            <p class="message">系统繁忙 请稍后再试</p>
          </div>
          <div class="d-footer">
            <img src="${ctx}/resource/images/index/dialog_btn_back.png" class="btn one back" alt="" onclick="dialogClose()"> <!--返回按钮-->
          </div>
        </div>
        <!-- 查看no open -->
        <div class="dialog noopen">
          <div class="d-body">
          </div>
          <div class="d-footer">
            <img src="${ctx}/resource/images/index/dialog_btn_back.png" class="btn one back" alt="" onclick="dialogClose()"> <!--返回按钮-->
          </div>
        </div>
	<!-- 加活力确认 -->
      <div class="dialog qd-confirm">
      <div class="d-top"> 
      <img src="${ctx}/resource/images/champions/d-head.png?2">
      </div>
        <div class="d-body">
          <textarea>我在参与#来吧冠军##全民冠军时刻#小样明星冠军榜的投票活动，为XXX加了XXX活力！给喜欢的偶像加活力，累积活力越多，占总活力比例就越高，获得鲜花也就越多！每周一万朵鲜花等你抢！小伙伴们一起支持XXX吧！抢花传送门：【H5链接】小样乳酸盐，为冠军带盐！</textarea>
		   <img id="wb_pic" src="${ctx}/resource/images/index/qd_dialog_banner_2.jpg?2" class="qd_banner"> 
        </div>
        <div class="d-bottom">
       
        <img src="${ctx}/resource/images/index/d-foot1.png?2">
        </div>
        <div class="d-footer">
          <img src="${ctx}/resource/images/index/dialog_btn_back.png" class="btn btns back" alt="" onclick="dialogClose()"> <!--返回按钮-->
          <img src="${ctx}/resource/images/index/dialog_btn_yes.png" class="btn btns yes" alt="" onclick="submit()" id="subimg"> <!--确认按钮-->
        </div>
      </div>
        <!-- 兑换成功 -->
        <div class="dialog success">
          <div class="d-body">
          </div>
          <div class="d-footer">
            <img src="${ctx}/resource/images/index/dialog_btn_back.png" class="btn one back" alt="" onclick="dialogClose()"> <!--返回按钮-->
          </div>
        </div>
      </div>
    </div>
    <div class="mask"></div>
    <script> 
      //加活力确定提交
      var energyCurrency = ${championUser.energy_currency};
      var is_chang="${is_chang!}";
      function energyClick(e) {
      
      if(is_chang == "1"){
				     dialog(".noopen");
				     return;
			}
      var start_head_pic=$(e).attr("start_img");
      var start_name=$(e).attr("name");
      var start_id=$(e).attr("start_id");
      var energy_number=$(e).attr("enery_index");
      var randomNum=Math.floor(Math.random()*10+1);
                var diaolog_pic="${ctx}/resource/images/index/qd_dialog_banner_2.jpg";
			    var pic="/alidata/server/tomcat-7.0.54/webapps/xyChampion/resource/images/index/qd_dialog_banner_2.jpg";
			    if( randomNum == 1){
			       pic="/alidata/server/tomcat-7.0.54/webapps/xyChampion/resource/images/index/first.jpg";
			       diaolog_pic="${ctx}/resource/images/index/first.jpg";
			    }
			    if( randomNum == 2){
			       pic="/alidata/server/tomcat-7.0.54/webapps/xyChampion/resource/images/index/second.jpg";
			       diaolog_pic="${ctx}/resource/images/index/second.jpg";
			    }
			    if( randomNum == 3){
			       pic="/alidata/server/tomcat-7.0.54/webapps/xyChampion/resource/images/index/third.jpg";
			       diaolog_pic="${ctx}/resource/images/index/third.jpg";
			    }
			    if( randomNum == 4){
			       pic="/alidata/server/tomcat-7.0.54/webapps/xyChampion/resource/images/index/four.jpg";
			       diaolog_pic="${ctx}/resource/images/index/four.jpg";
			    }
			    if( randomNum == 5){
			       pic="/alidata/server/tomcat-7.0.54/webapps/xyChampion/resource/images/index/five.jpg";
			       diaolog_pic="${ctx}/resource/images/index/five.jpg";
			    }
			    if( randomNum == 6){
			       pic="/alidata/server/tomcat-7.0.54/webapps/xyChampion/resource/images/index/six.jpg";
			       diaolog_pic="${ctx}/resource/images/index/six.jpg";
			    }
			    if( randomNum == 7){
			       pic="/alidata/server/tomcat-7.0.54/webapps/xyChampion/resource/images/index/seven.jpg";
			       diaolog_pic="${ctx}/resource/images/index/seven.jpg";
			    }
			    if( randomNum == 8){
				   pic="/alidata/server/tomcat-7.0.54/webapps/xyChampion/resource/images/index/eight.jpg";
				   diaolog_pic="${ctx}/resource/images/index/eight.jpg";
				}
			    if( randomNum == 9){
					   pic="/alidata/server/tomcat-7.0.54/webapps/xyChampion/resource/images/index/nine.jpg";
					   diaolog_pic="${ctx}/resource/images/index/nine.jpg";
				}
			    if( randomNum == 10){
					   pic="/alidata/server/tomcat-7.0.54/webapps/xyChampion/resource/images/index/ten.jpg";
					   diaolog_pic="${ctx}/resource/images/index/ten.jpg";
				}
    	    $("#avatar").css("background-image", "url("+start_head_pic+")");
			$("#name").html(start_name);
			$("#energyCurrency").html(energyCurrency);
			$("#wb_pic").attr("src",diaolog_pic);
			dialog(".cheerup");
			submit=function(){
				var pay_currency = $("#num").val();
				if(pay_currency<=0){
					var msg="<p class='message'>数量必须大于0</p>";
				     $("#fail-energy").html(msg);
				     dialog(".fail");
				     return;
				}
				$("#subimg").attr("disabled","disabled");
			    statistics();//cnzz统计
			    
				$.ajax({
					type:"POST",
					async : false,	
					url:"${ctx}/home/startAddEnergy?start_id="+start_id+"&pay_currency="+pay_currency,
					data:{"content":"我在参与#来吧冠军##全民冠军时刻#小样明星冠军榜的投票活动，为start_name加了encurry活力！给喜欢的偶像加活力，累积活力越多，占总活力比例就越高，获得鲜花也就越多！每周一万朵鲜花等你抢！小伙伴们一起支持start_name吧！抢花传送门：http://lbgj.fansiji.com/xyChampion/home/homePage?source=xymxb小样乳酸盐，为冠军带盐！",
					      "pic":pic},
					success : function(json){
						 if(json.code == 0 ){
							 $("#myEnergyCurrency").html(json.myEnergyCurrency);
							 $("#"+energy_number+"").html(json.startEnergyCurrency);
							 energyCurrency = json.myEnergyCurrency;
						     dialog(".success");     
						 }else{
						     if(json.code == -5){
						     dialog(".noopen");
						     is_chang="1";
						     }else{
						     var msg="<p class='message'>"+json.msg+"</p>";
						     $("#fail-energy").html(msg);
						     dialog(".fail");
						     }
						     
						 }
						 $("#submit").removeAttr("disabled"); 
					}
				}); 
			}
      }
      function forwardChampionship(is_page){
    	  statistics(); //cnzz统计
    	  $.ajax({
    		  url:"${ctx}/home/getStartList",
    		  type:"POST",
    		  data:{
    			  "is_page":is_page
    		  },success : function(list){
	  			var htmStr="";
	  			var navHtm="";
	  			for(var i in list){
	  			//if(list[i].energy_percent >0 ){
	  				htmStr+="<li>";
	  				if(is_page==1 || (is_chang == "1" && is_page==1 )){
	  					htmStr+="<div class='index'><span>"+list[i].rownum+"</span></div>";
	  				}
					 var server_uri="${server_uri!}";
					 var start_head_pic=list[i].start_head_pic;
					 if(!start_head_pic){
					   start_head_pic="";
					 }else{
					  	htmStr+="<div class='avatar' style='background-image: url("+server_uri+""+list[i].start_head_pic+")'></div>";
					 }
					 var start_name=list[i].start_name;
					 if(!start_name){
						start_name="";
					 }else{
						start_name=decodeURI(start_name);
					 }
					 var energy_currency=list[i].energy_currency;
						  if(!energy_currency){
						  energy_currency="0";
						 } 
					 htmStr+="<div class='user'>";
					 htmStr+="<span class='name' >"+start_name+"</span>";
					 if(is_page==1){
					 if(is_chang == "1"){
					 var energy_percent=list[i].energy_percent;
					 if(energy_percent == "null" || energy_percent == null){
					    energy_percent="";
					 }else{
					  energy_percent=energy_percent+"%";
					 }
					 htmStr+="<span class='energy' id='energy-"+i+"'>"+energy_percent+"</span>";
					 }else{
					   htmStr+="<span class='energy' id='energy-"+i+"'>"+energy_currency+"</span>";
					 }
					 }else{
					 htmStr+="<span class='energy' id='energy-"+i+"'>"+energy_currency+"</span>";
					 }
					 
					 htmStr+="</div>";
					 var start_head_pic="${server_uri!}"+list[i].start_head_pic;
					 if(is_page !=1){
					   htmStr+="<img src='${ctx}/resource/images/champions/energy_btn.png' class='energy-btn' name='"+start_name+"' enery_index='energy-"+i+"' start_id='"+list[i].id+"' start_img='"+start_head_pic+"' onclick='energyClick(this)'>";
					 }else{
					 if(is_chang == "1"){
					  var flower_num=list[i].flower_num;
					  if(flower_num == "null" || flower_num == null){
					   flower_num="";
					   }
					 htmStr+="<span class='flower'>"+flower_num+"</span>";
						
					 }
					 }
					 htmStr+="</li>"; 
					 }         	 
	  			//}
	  			if(is_page==1){
	  				$("#champions nav").css("background-image","url(${ctx}/resource/images/champions/nav_1.png)");
		  			navHtm+="<ul>";
		  			navHtm+="<li><a href='${ctx}/home/homePage'>返回首页</a></li>";
		  			navHtm+="<li><a href='javascript:void(0);' onclick='forwardChampionship(2)'>加活力</a></li>";
		  			navHtm+="</ul>";
		  			$("#champions nav").html(navHtm);
	  			}else{
	  				$("#champions nav").css("background-image","url(${ctx}/resource/images/champions/nav.png)");
		  			navHtm+="<ul>";
		  			navHtm+="<li><a href='${ctx}/home/homePage'>返回首页</a></li>";
		  			navHtm+="<li><a href='javascript:void(0);' onclick='forwardChampionship(1)'>查看排行</a></li>";
		  			navHtm+="</ul>";
		  			$("#champions nav").html(navHtm);
	  			}
	  			$("#championship").html(htmStr);
	  			avatar();	//头像调整调用
	  		}
    	});
      }
      /* function nextPage(pnum){
    	  statistics(); //cnzz统计
    	  	$("#more").remove();
    	  	$.post("${ctx}/home/getStartList",{
    	  		page:pnum+1,
    	  		is_page:'1'
    	  		},function(json){
    	  			var htmStr="";
    	  			var pageHtm="";
    	  			var list=json.list;
    	  			for(var i in list){
    	  				htmStr+="<li>";
 						 htmStr+="<div class='index'><span>"+list[i].rownum+"</span></div>";
 						 var server_uri="${server_uri!}";
 						 var start_head_pic=list[i].start_head_pic;
 						 if(!start_head_pic){
 						   start_head_pic="";
 						 }else{
 						  	htmStr+="<div class='avatar' style='background-image: url("+server_uri+""+list[i].start_head_pic+")'></div>";
 						 }
 						 var start_name=list[i].start_name;
 						 if(!start_name){
 							start_name="";
 						 }else{
 							start_name=decodeURI(start_name);
 						 }
 						 var energy_currency=list[i].energy_currency;
	  						  if(!energy_currency){
	  						  energy_currency="0";
	  						 } 
 						 htmStr+="<div class='user'>";
 						 htmStr+="<span class='name' >"+start_name+"</span>";
 						 htmStr+="<span class='energy' id='energy-"+list[i].rownum+"'>"+energy_currency+"</span>";
 						 htmStr+="</div>";
 						 var start_head_pic="${server_uri!}"+list[i].start_head_pic;
 						 htmStr+="<img src='${ctx}/resource/images/champions/energy_btn.png' class='energy-btn' name='"+start_name+"' enery_index='energy-"+list[i].rownum+"' start_id='"+list[i].id+"' start_img='"+start_head_pic+"' onclick='energyClick(this)'>";
 						 htmStr+="</li>";          
    	  			}
    	  			if(json.pageNumber < json.totalPage){
    	  				pageHtm+="<p id='more' class='more' onclick='nextPage("+json.pageNumber+"); return false;'>点击加载更多...</p>";
    	  			}
    	  			$("#championship").append(htmStr);	
    	  			$("#morePage").html(pageHtm);
    	  			avatar();	//头像调整调用
    	  	},'json');
    	  } */
    </script>
    <script type="text/javascript" src="${ctx}/resource/js/champions.js?20160430"></script>
  </body>
</html>